<template>
  <template v-if="modelData.detailType === 'GROUPPANEL'">
    <FormGroupPanel :modelData="modelData" :controller="c"></FormGroupPanel>
  </template>
  <template v-else-if="modelData.detailType === 'FORMITEM'">
    <IBizFormItem :modelData="modelData" :controller="c"></IBizFormItem>
  </template>
</template>
<script lang="ts" setup>
import { IDEFormDetail } from '@ibiz/model-core'

const props = defineProps({
  controller: {
    type: Object as PropType<any>,
    required: true,
  },
  modelData: {
    type: Object as PropType<IDEFormDetail>,
    required: true,
  },
})
const c = computed(() => {
  if (props.controller.details) {
    return props.controller.details[props.modelData.id!]
  }

  if (props.controller.form.details) {
    return props.controller.form.details[props.modelData.id!]
  }

  return props.controller
})
</script>
